import React from 'react';
import { Button } from '@teamix/ui';
import { YunxiaoIcon } from '@alife/devops-ui';
import { isPre } from 'utils/tenant';
import { navigateOpen } from 'utils/router';
import utils from 'utils';
import track from 'utils/track';
import intl from '../../../../../../../locale';

const PAGE_NAME = 'Repo-Pipeline';

// 支持代码库一键跳Flow创建CI流程
export default class FlowBtn extends React.Component {
  goFlow = () => {
    const { pathResource, resourceSubject } = window.FORCE;
    const { projectInfo, isInitialize, startTimeInterval } = this.props;
    const tpl = {
      type: 'codeup',
      template: {
        id: pathResource.id,
        gitHttpURL: projectInfo.http_url_to_repo,
        branch: utils.revisionEncodeURI(resourceSubject.revision),
      },
    };

    const url = `https://${isPre ? 'pre-' : ''}flow.aliyun.com/my/new?sourceTpl=${btoa(
      JSON.stringify(tpl),
    )}`;
    navigateOpen(url);
    track({
      action: 'creat_pipeline',
      page: PAGE_NAME,
      type: isInitialize ? 'initialize' : '',
    });
    startTimeInterval && startTimeInterval();
  };

  render() {
    const {
      btnText = intl.get({
        id: 'code-assets.projectPipeline.containers.flowBtn.CreateAPipeline',
        defaultMessage: '新建流水线',
      }),
    } = this.props;
    return (
      <Button type="primary" onClick={this.goFlow} {...this.props}>
        {this.props.text ? <YunxiaoIcon type="add-fill" /> : null}
        {btnText}
      </Button>
    );
  }
}
